<!DOCTYPE html>

  <!--[if lt IE 7]>
    <html class="lt-ie9 lt-ie8 lt-ie7" lang="en">
  <![endif]-->

  <!--[if IE 7]>
    <html class="lt-ie9 lt-ie8" lang="en">
  <![endif]-->

  <!--[if IE 8]>
    <html class="lt-ie9" lang="en">
  <![endif]-->

  <!--[if gt IE 8]>
    <!-->
    <html lang="en">
    <!--
  <![endif]-->

  <head>
    <meta charset="utf-8">
    <title>Slick Admin</title>
    <meta name="author" content="John">
    <meta content="width=device-width, initial-scale=1.0, user-scalable=no" name="viewport">
    <meta name="description" content="Slick Admin Admin UI">
    <meta name="keywords" content="Slick Admin, Admin UI, Admin Dashboard, John">
    
    <script src="js/html5-trunk.js"></script>
    
    <link href="css/style.css" rel="stylesheet">
    <!--[if lte IE 7]>
    <script src="js/lte-ie7.js"></script>
    <![endif]-->

    <!-- bootstrap css -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- custom css -->
    <link href="css/main.css" rel="stylesheet">

    <!-- Scripts -->
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.js"></script>
    <script src="js/jquery-ui-1.8.23.custom.min.js"></script>

    <!-- Easy pie charts -->
    <script src="js/jquery.easy-pie-chart.js"></script>

    <!-- Sparkline graphs -->
    <script src="js/jquery.sparkline.js"></script>

    <!-- Data tables -->
    <script src="js/jquery.dataTables.js"></script>

    <!-- Custom Js -->
    <script src="js/custom-tables.js"></script>

    <!-- custom Js -->
    <script src="js/custom.js"></script>

    <script>
        $(document).ready(function () {
            alert("Hello");
            $.ajax({
                type: "post",
                url: "http://localhost:8080/adminShower/indexContent",
                data: {"userName":$("#user").val(), "passwd":$("#passwd").val()},
                dataType: "json",
                success: function(data,statusTxt,xhr){
//                    alert(data.data.length);
//                    if(data.data.length>0){
//                        $('#data-table').addClass(gradeX);
//                    }

                    var rowTemplate = '<tr class="tr_'+rowCount+'"><td>'+rowCount+'</td><td ></tr>';
                    var date=data.data.modifyTime;
                    var datestr=date.toString();
                    var helpTitlestr=data.data.helpTitle.toString();
                    $("#biaoti").text(data.data.helpTitle);
                    $("#shijian").text(datestr);


                },
                error:function(xhr,textStatus){
                    alert("公告也进来");
                    console.log('错误');
                    console.log(xhr);
                    console.log(textStatus);
                },
                complete:function(){
                    console.log('结束');
                }
            });

        });
    </script>

  </head>

  <body>
    
   


    <!-- Main Container start -->
    <div class="main-container">
        <!-- Dashboard wrapper start -->
      <div class="dashboard-wrapper">

        
   
        <!-- Row start -->
        <div class="row">
          <div class="col-md-12">
            <div class="widget">
              <div class="widget-header">
                <div class="title">
                  <span class="fs1" aria-hidden="true" data-icon="&#xe14a;"></span> Data Table
                </div>
              </div>
              <div class="widget-body">
                <div id="dt_example" class="example_alt_pagination">
                  <table class="table table-condensed table-striped table-hover table-bordered pull-left" id="data-table">    
                    <thead>
                      <tr>
                        <th style="width:10%">房间号</th>
                        <th style="width:10%">澡位</th>
                        <th style="width:15%" class="hidden-phone">状态</th>
                        <th style="width:20%" class="hidden-phone">管理员</th>
                        <th style="width:30%" class="hidden-phone">最后修改时间</th>
                        <th style="width:15%" class="hidden-phone">修改</th>
                      </tr>
                    </thead>
                    <tbody>
                      <tr class="gradeX">
                        <td>1</td>
                        <td>024</td>
                        <td class="hidden-phone">1</td>
                        <td class="hidden-phone">0011213</td>
                        <td class="hidden-phone">2018-04-02 12:22:11</td>
                        <td class="hidden-phone">
                          <a href="#" class="actions-icons">
                            <img src="img/edit-icon.png" alt="edit" class="icons">
                          </a>
                        </td>
                      </tr>

                    </tbody>
                  </table>
                  <div class="clearfix"></div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- Row end -->

      

    

      </div>
      <!-- Dashboard wrapper end -->
    
    </div>
    <!-- Main Container end -->




  </body>
</html>